<div ng-controller="alarmCtrl" class="clearfix script-content">
    <div class="wrapper-md">
        <div class="panel panel1 panel-default">
            <div class="">
                <div class="search-box m-b-md">
                    <div class="legend">查询条件</div>
                    <div class="search-content">
                        <div class="form-group">
                            <label class="control-label">告警名称：</label>
                            <input type="name" ng-model="searchByname" class="form-control input-sm" placeholder="" aria-controls="DataTables_Table_3">
                        </div>
                    </div>
                    <div class="search-btn">
                        <button class="btn btn-primary w-xs m-r" ng-click="getData(1)"><i class="fa fa-search"></i> 查询</button>
                        <!--<button class="btn btn-primary w-xs m-r" ng-click="add($event)"><i class="fa fa-plus-circle"></i> 新增</button>-->
                    </div>
                </div>

                <div class="">
                    <div class="dataTables_wrapper form-inline">
                        <div class="row">
                            <div class="col-sm-12" style="margin-top: -10px;">
                                <table class="table b-light m-b-xxs">
                                    <thead class="table-header">
                                    <tr>
                                        <th width="20%" class="font-15 text-center">告警名称</th>
                                        <th width="15%" class="font-15 text-center">告警类型</th>
                                        <th width="15%" class="font-15 text-center">告警目标</th>
                                        <th width="10%" class="font-15 text-center">告警级别</th>
                                        <th width="10%" class="font-15 text-center">告警状态</th>
                                        <th width="15%" class="font-15 text-center">触发时间</th>
                                        <!--<th width="10%" class="font-15 text-center">确认时间</th>-->
                                        <!--<th width="10%" class="font-15 text-center">确认人</th>-->
                                        <th width="15%" class="font-15 text-center">所属平台</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr class="table-content" ng-repeat="row in userList" ng-if="!isImageData">
                                        <td width="20%" class="font-15 detail-href text-center text-overflow" style="max-width:216px;" title="{{row.name}}"  ng-bind="row.name" ng-click="detail(row.id)"></td>
                                        <td width="15%" class="font-15 text-center text-overflow" style="max-width:162px;" title="{{row.type}}" ng-bind="row.type"></td>
                                        <td width="15%" class="font-15 text-center text-overflow" style="max-width:162px;" title="{{row.target}}" ng-bind="row.target"></td>
                                        <td width="10%" class="font-15 text-center text-overflow" style="max-width:107px;" title="{{row.level|cn:'alarmlevel'}}" ng-bind="row.level|cn:'alarmlevel'"></td>
                                        <td width="10%" class="font-15 text-center text-overflow" style="max-width:107px;" >
                                            <div class="text-left" style="padding-left:25%;">
                                                <i class="status-dot-style" ng-class="{'CONFIRMED':'btn-success','UNCONFIRM':'btn-warning'}[row.status]"></i><span class="status-span-style" title="{{row.status|cn:'alarmStatus'}}" ng-bind="row.status|cn:'alarmStatus'"></span>
                                            </div>
                                        </td>
                                        <td width="15%" class="font-15 text-center text-overflow" style="max-width:161px;" title="{{row.gmtTrigger}}" ng-bind="row.gmtTrigger"></td>
                                        <!--<td width="10%" class="font-15 text-center text-overflow" style="max-width:113px;" title="{{row.gmtConfirm}}" ng-bind="row.gmtConfirm"></td>-->
                                        <!--<td width="10%" class="font-15 text-center text-overflow" style="max-width:113px;" title="{{row.confirmer}}" ng-bind="row.confirmer"></td>-->
                                        <td width="15%" class="font-15 text-center text-overflow" style="max-width:161px;" title="{{row.vendorName}}" ng-bind="row.vendorName"></td>
                                    </tr>
                                    <tr ng-if="isImageData">
                                        <td class="td-nodata" colspan="7"></td>
                                    </tr>
                                    </tbody>
                                </table>
                                <div class="clearfix">
                                    <div class="col-sm-6" style="padding: 7px 15px;">
                                        <div class="paginationTables_info">总共<span ng-bind="totalCount"></span>条, 每页<span ng-bind="param.rows"></span>条</div>
                                    </div>
                                    <div class="col-sm-6 text-right">
                                        <pagination style="" boundary-links="true" total-items="totalCount" items-per-page="param.rows" max-size="10" ng-model="param.page" ng-change="getData(param.page)" previous-text="&lsaquo;" next-text="&rsaquo;" first-text="&laquo;" last-text="&raquo;"></pagination>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div ng-if="showDetail" ng-hide-detail="" class="animated tab-detail" ng-class="{true:'bounceInRight',false:'bounceOutRight'}[isActive]">
                            <div class="col-md-12">
                                <div class="panel panel-default" style="padding:0;">
                                    <div class="panel-heading font-bold">
                                        <span class="p-l-6">告警详情</span>
                                    </div>
                                    <div class="panel-body pmb-block" style="border:none;">
                                        <div class="form-horizontal">
                                            <div class="">
                                                <div class="pmbb-header">
                                                    <h5 class="console-title">基本信息</h5>
                                                </div>
                                                <div class="pmbb-body p-l-30">
                                                    <div class="form-group">
                                                        <div class="col-lg-6">
                                                            <dl class="dl-horizontal">
                                                                <dt>告警名称：</dt>
                                                                <dd ng-bind="userDetail.name"></dd>
                                                            </dl>
                                                        </div>
                                                        <div class="col-lg-6">
                                                            <dl class="dl-horizontal">
                                                                <dt>告警类型：</dt>
                                                                <dd ng-bind="userDetail.type"></dd>
                                                            </dl>
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <div class="col-lg-6">
                                                            <dl class="dl-horizontal">
                                                                <dt>告警目标：</dt>
                                                                <dd ng-bind="userDetail.target"></dd>
                                                            </dl>
                                                        </div>
                                                        <div class="col-lg-6">
                                                            <dl class="dl-horizontal">
                                                                <dt>告警状态：</dt>
                                                                <dd>
                                                                    <i class="status-dot-style" ng-class="{'CONFIRMED':'dot-8','UNCONFIRM':'dot-10'}[userDetail.status]"></i>
                                                                    <span class="status-span-style" title="{{userDetail.status|cn:'alarmStatus'}}" ng-bind="userDetail.status|cn:'alarmStatus'"></span>
                                                                </dd>
                                                            </dl>
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <div class="col-lg-6">
                                                            <dl class="dl-horizontal">
                                                                <dt>触发时间：</dt>
                                                                <dd ng-bind="userDetail.gmtTrigger"></dd>
                                                            </dl>
                                                        </div>
                                                        <div class="col-lg-6">
                                                            <dl class="dl-horizontal">
                                                                <dt>确认时间：</dt>
                                                                <dd ng-bind="userDetail.gmtConfirm"></dd>
                                                            </dl>
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <div class="col-lg-6">
                                                            <dl class="dl-horizontal">
                                                                <dt>确认人：</dt>
                                                                <dd ng-bind="userDetail.confirmer"></dd>
                                                            </dl>
                                                        </div>
                                                        <div class="col-lg-6">
                                                            <dl class="dl-horizontal">
                                                                <dt>所属平台：</dt>
                                                                <dd ng-bind="userDetail.vendorName"></dd>
                                                            </dl>
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <div class="col-lg-6">
                                                            <dl class="dl-horizontal">
                                                                <dt>备注：</dt>
                                                                <dd ng-bind="userDetail.remark"></dd>
                                                            </dl>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="detail-go-back" ng-click="goBack()"><i class="fa fa-angle-right"></i></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>